<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
        //(1).实例化ajax对象
       let xhr = new XMLHttpRequest();
       //(2).设置请求方法和地址
       xhr.open('post', 'http://www.tuling123.com/openapi/api');
       //(3).设置请求头（post请求才需要设置）
       xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
       //(4).发送请求 ： 参数格式  'key=value' 
       xhr.send('key=8b2116b8ddb94b6681fbbef3ee9bbbce&info=你吃饭了?');
       //(5).注册回调函数
       //a. onload 是新式浏览器才支持的
       //b. 如果要兼容更早的浏览器，可以使用 onreadystatechange
       //c. onreadystatechange触发时机 ： xhr.readState状态变化
      // xhr.onload = function() {};  
      xhr.onreadystatechange = function(){
          //onreadystatechange会触发多次，一般需要判断xhr.readState == 4 才获取响应数据
            if(xhr.readyState == 4){
                console.log(xhr.responseText);
            };
       };
    </script>
</body>
</html>